<template>
	<div class="news">
		<h1>{{ $t("page.index.news.title") }}</h1>
    <div class="content">
        <h2>{{ getCurData.title }}</h2>
        <p>{{ getCurData.desc }}</p>
        <div class="part" >{{ getCurData.container[0] }}</div>
    </div>
	</div>
</template>

<script>
export default {
  data() {
    return {};
  },
  computed: {
    getCurData:function() {
      return this.$t("page.index.news.detail.content")[this.id];
    }
  },
  created() {
    this.id = this.$route.query.id-1
  }
};
</script>
<style>
.news {
  width: 1200px;
  min-height: 1000px;
  margin: 0 auto;
}
.news h1 {
  margin-top: 50px;
}
.news .content {
  padding: 30px 0;
}
.news h2 {
  font-size: 18px;
}
.news p {
  margin: 20px 0;
}
.news .part {
  font-size: 16px;
  line-height: 28px;
  text-indent: 2em;
  text-align: left;
}
</style>
